<template>
	<view class="content">
		<view class="login-title">
			<view class="logo">
				<open-data type="userAvatarUrl"></open-data>
			</view>
		</view>
		<view class="login-tip">
			<view class="login-tip-big">
				申请获取以下权限
			</view>
			<view class="login-tip-small">
				获得你的公开信息 （昵称、头像等）
			</view>
		</view>
		<view class="login-b flc">
			<button class="auth-btn refuse" @click="handleRefuse">拒绝</button>
			<button class="auth-btn" @click="handleLogin" hover-class="btn-hover">允许</button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			}
		},
		methods: {
			handleRefuse() {
				uni.reLaunch({
					url: "/pages/tabBar/mine/index",
				});
			},
			// 1.wx.login()进行登录
			handleLogin() {
				var tmp = this;
				uni.login({
					success(e) {
						tmp.$u.api.mine.weixinLogin({
							code: e.code
						}, {
							params: {
								grant_type: 'wechat',
								scope: 'server'
							},
							header: {
								Authorization: 'Basic YXBwbGV0OmFwcGxldA==',
								'Content-Type': 'application/x-www-form-urlencoded;charset=UTF-8'
							}
						}).then((res) => {
							// 登陆成功，存储相关信息
							// tmp.$u.vuex("vuex_token", res.access_token);
							// tmp.$u.vuex("vuex_user", res.user_info);
							uni.setStorageSync('token', res.access_token);
							uni.setStorageSync('user_info', res.user_info);
							uni.setStorageSync('recognizeStatus', res.user_info.recognizeStatus)
							tmp.$u.toast("恭喜您，登录成功！");
							// 跳转页面
							setTimeout(() => {
								uni.reLaunch({
									url: "/pages/tabBar/mine/index",
								});
							}, 500);
						}).catch((e) => {
							tmp.$u.toast(
								"登录出错，请联系管理员"
							);
							setTimeout(() => {
								uni.reLaunch({
									url: "/pages/tabBar/mine/index",
								});
							}, 1000);
						});
					}
				})
			},
			// 2.微信手机号授权登录
			getUserInfo: function(e) {
				var tmp = this;
				if (e.detail.errMsg == 'getUserInfo:fail auth deny') {
					_this.$common.errorToShow('未授权')
				}
				let rawData = e.detail.rawData
				let signature = e.detail.signature
				let encryptedData = e.detail.encryptedData
				let iv = e.detail.iv
				uni.login({
					success(e) {
						tmp.$u.api.mine.weixinLogin({
							code: e.code,
							rawData: rawData,
							signature: signature,
							encryptedData: encryptedData,
							iv: iv
						}, {
							params: {
								grant_type: 'wechat',
								scope: 'server'
							},
							header: {
								Authorization: 'Basic YXBwbGV0OmFwcGxldA==',
								'Content-Type': 'application/x-www-form-urlencoded;charset=UTF-8'
							}
						}).then((res) => {
							tmp.$u.toast("恭喜您，登录成功！");
							// 登陆成功，存储相关信息
							tmp.$u.vuex("vuex_token", res.access_token);
							tmp.$u.vuex("vuex_user", res.user_info);
							//跳转页面
							setTimeout(() => {
								uni.reLaunch({
									url: "/pages/tabBar/mine/index",
								});
							}, 1000);
						}).catch((e) => {
							tmp.$u.toast(
								"登录出错，请联系管理员"
							);
							setTimeout(() => {
								uni.reLaunch({
									url: "/pages/tabBar/mine/index",
								});
							}, 1000);
						});
					}
				})
			}
		}
	}
</script>

<style lang="scss">
	.content {
		background-color: #fff;
		height: 100vh;
		padding: 100upx 60upx 0;
	}

	.login-title {
		display: flex;
		justify-content: center;
		padding-bottom: 40upx;
		border-bottom: 1upx solid #dddddd;
	}

	.logo {
		display: block;
		width: 180upx;
		height: 180upx;
		border-radius: 50%;
		overflow: hidden;
		border: 2px solid #fff;
		box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.2);
	}

	.login-tip {
		padding: 60upx 0;

		&-big {
			font-size: 28upx;
			line-height: 80upx;
		}

		&-small {
			font-size: 12px;
			color: #9e9e9e;
		}
	}

	.app-name {
		font-size: 28upx;
		color: #999;
	}

	.login-b {
		margin-top: 40upx;
	}

	.auth-btn {
		flex: 1;
		display: inline-block;
		height: 80upx;
		width: 40%;
		line-height: 80upx;
		text-align: center;
		font-size: 12px;
		color: #FFF;
		background: #1aad19;
		border-radius: 40upx;

		&.refuse {
			background: #999;
			margin-right: 40upx;
		}
	}
</style>
